<template>
	<view class="nav">
		<view class="nav_item" v-for="item in list">
			<view @click="searchKey(item.name)" :key="item.id" class="nav_item_link">
				<image class="image" :src="item.icon">
					<text>{{item.name}}</text>
			</view>
		</view>
		<!-- <view class="nav_item">
			<navigator url="../search/search?searchKey=外套" class="nav_item_link">
				<image class="image" :src="require('../../static/index/外套.png')">
					<text>外套</text>
			</navigator>
		</view>
		<view class="nav_item" >
			<navigator url="../search/search?searchKey=手机通讯" class="nav_item_link">
				<image class="image" :src="require('../../static/index/手机.png')"
				 alt="">
					<text>手机通讯</text>
			</navigator>
		</view>
		<view class="nav_item" >
			<navigator url="../search/search?searchKey=智能设备" class="nav_item_link">
				<image class="image" :src="require('../../static/index/icon_智能手表.png')"
				 alt="">
					<text>智能设备</text>
			</navigator>
		</view>
		<view class="nav_item" >
			<navigator url="../search/search?searchKey=电视" class="nav_item_link">
				<image class="image" :src="require('../../static/index/电视.png')"
				 alt="">
					<text>电视</text>
			</navigator>
		</view>
		<view class="nav_item" >
			<navigator url="../search/search?searchKey=洗衣机" class="nav_item_link">
				<image class="image" :src="require('../../static/index/洗衣机.png')"
				 alt="">
					<text>洗衣机</text>
			</navigator>
		</view>
		<view class="nav_item">
			<navigator url="../search/search?searchKey=厨房卫浴" class="nav_item_link">
				<image class="image" :src="require('../../static/index/厨房.png')"
				 alt="">
					<text>厨房卫浴</text>
			</navigator>
		</view>
		<view class="nav_item">
			<navigator url="../search/search?searchKey=卧室家具" class="nav_item_link">
				<image class="image" :src="require('../../static/index/卧室家具.png')"
				 alt="">
					<text>卧室家具</text>
			</navigator>
		</view>
		<view class="nav_item" >
			<navigator url="../search/search?searchKey=电脑配件" class="nav_item_link">
				<image class="image" :src="require('../../static/index/电脑.png')"
				 alt="">
					<text>电脑配件</text>
			</navigator>
		</view> -->
	<!-- 	<view class="nav_item">
			<navigator url="../search/search?searchKey=汽车装饰" class="nav_item_link">
				<image class="image" :src="require('../../static/index/汽车养护与装饰.png')"
				 alt="">
					<text>汽车装饰</text>
			</navigator>
		</view>
		<view class="nav_item">
			<navigator url="../search/search?searchKey=衬衫" class="nav_item_link">
				<image class="image" :src="require('../../static/index/衬衫.png')"
				 alt="">
					<text>衬衫</text>
			</navigator>
		</view> -->
	</view>
</template>
<script>
	import PmsPortalProductController from '../../api/PmsPortalProductController.js'
	export default {
		data() {
			return{
				list:[]
			}
		},
		async created() {
			await PmsPortalProductController.categoryTreeList().then(res=>{
				if(res.data.code==200){
					res.data.data.map(e=>{
						e.children.map(es=>{
							if(es.navStatus==1){
								this.list.push(es)
							}
						})
					})
				}
			}).catch(err=>{

			})
		},
		methods:{
			searchKey(name){
				uni.navigateTo({
					url:'../search/search?searchKey='+name
				})
			}
		}
	}
</script>
<style scoped>
	

	.nav {
		width: 100%;
		padding-top: 16px;
		height: 350rpx;
		background: #fff;
		display: flex;
		flex-wrap: wrap ;
	}

	.nav .nav_item {
		width: 25%;
		
	}

	.nav .nav_item .nav_item_link {
		width: 100%;
		height: 100%;
		display: block;
		text-align: center;
		line-height: 50%;
	}

	.nav .nav_item .nav_item_link .image {
		display: block;
		width: 35px;
		height: 35px;
		margin: 0 auto;
	}
</style>